<!-- LOGO HEADER END-->
<section class="menu-section">
  <div class="container">
    <div class="row ">
      <div class="col-md-12">
        <div class="navbar-collapse collapse ">
          <ul id="menu-top" class="nav navbar-nav navbar-right">
            <li><a href="/">HOME</a></li>
            <li><a href="/product" class="menu-top-active">PRODUCTS</a></li>
            <li><a href="/about-us" >ABOUT US</a></li>
            <li><a href="/contact-us">CONTACT US</a></li>
            <li><a href="/faq">FAQs</a></li>
            <li><a href="/pdf">PDF DOWNLOAD</a></li>
            <li><a href="/equipment">EQUIPMENT</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</section>
<div class="below-slideshow">
  <div class="container">
    <div class="row">

      <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <div class="txt-block">
          <h1 class="head-line">OUR Products</h1>
        </div>
      </div>
    </div>

  </div>
</div>
<!-- BELOW SLIDESHOW SECTION END-->

<div class="just-sec" id="port-folio">


  <div class="container">

    <div class="row " >
      <ul id="filters" >
        <li><span class="filter active label label-primary" data-filter="">All products</span></li>
        <% var color = ['success', 'info', 'danger', 'warning', 'primary']%>
        <% for(var i=0; i<category.length; i++) {%>
        <li><span class="filter active">/</span></li>
        <li><span class="filter label label-<%= color[i] %>" data-filter="<%= category[i].category_name %>"><%= category[i].category_name %></span></li>
        <%}%>
      </ul>
      <% if(data) {%>
      <% for(var i=0; i<data.length; i++){%>
      <div class="col-md-4 " style="margin-bottom: 35px">
        <div class="portfolio-item mix_all" data-filter="<%= data[i].cat %>" >
          <a href="#" data-toggle="modal" data-target="#myModal-<%= i %>">
          <img src="/img/<%= data[i].img %>" class="img-responsive " alt="" />
          </a>
          <div class="p-name">
            <%= data[i].product_name %><br>
            <%= data[i].specification.split(',') %>
          </div>
        </div>
      </div>
      <div class="modal fade" id="myModal-<%= i %>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="margin-top: 200px;">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="myModalLabel">产品详情</h4>
            </div>
            <div class="modal-body">
              <%= data[i].specification %>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
              <button type="button" class="btn btn-primary">保存</button>
            </div>
          </div>
        </div>
      </div>
      <% } %>
      <% } %>
    </div>
  </div>
</div>
